/**
 * Sample React Native App
 * https://github.com/facebook/react-native
 * @flow
 */

import React, { Component } from 'react';
// import SwitchButton from 'lyef-switch-button';
import {
    ScrollView,
    Platform,
    Switch,
    StyleSheet,
    Text,
    View,

} from 'react-native';
import pxToDp from "../config/pxToDp";

export default class ChattingScene extends Component {

    detail(){
        console.log("点击switch开关");
    }
    constructor(p){
        super(p);
        this.state = {
            value:true
        };
    }

    render() {
        return (
            <View style={styles.container1}>
                <ScrollView style={styles.container}>
                    {/*<View style={styles.biankuang}><Text style={styles.instructions1}>通讯录</Text></View>*/}
                    <View style={styles.bigline1}>
                        <View style={styles.smallline}>
                            <Text style={styles.instructions}>使用听筒播放语音</Text>
                            <Switch disabled={false} value={this.state.value}  onValueChange = {(value) => {

                                this.setState({
                                    value:value
                                });
                                this.detail();

                            }} ></Switch>
                        </View>
                    </View>
                    <View style={styles.bigline}>
                        <View style={styles.smallline}>
                            <Text style={styles.instructions}>回车键发送消息</Text>
                            <Switch disabled={false} value={this.state.value}  onValueChange = {(value) => {

                                this.setState({
                                    value:value
                                });
                                this.detail();

                            }} ></Switch>
                        </View>
                    </View>
                    <View style={styles.bigline}>
                        <View style={styles.smallline}>
                            <Text style={styles.instructions}>聊天背景</Text>
                        </View>
                    </View>
                    <View style={styles.bigline}>
                        <View style={styles.smallline}>
                            <Text style={styles.instructions}>表情管理</Text>
                        </View>
                    </View>
                    <View style={styles.biankuang}><Text style={styles.instructions1}>聊天记录</Text></View>
                    <View style={styles.bigline}>
                        <View style={styles.smallline}>
                            <Text style={styles.instructions}>聊天记录迁移</Text>
                        </View>
                    </View>
                    <View style={styles.bigline}>
                        <View style={styles.smallline1}>
                            <Text style={styles.instructions}>清空聊天记录</Text>
                        </View>
                    </View>

                </ScrollView>
            </View>
        );
    }
}

const styles = StyleSheet.create({

    biankuang:{
        paddingLeft:20,
        justifyContent:'center',
        height:pxToDp(80),
    },

    container1:{
        flex:1,
    },
    container: {
        // margin:0,
        // padding:0,
        backgroundColor: '#EBEBEB',
    },
    bigline: {
        paddingLeft: pxToDp(32),
        paddingRight: pxToDp(32),
        backgroundColor:'#FFFFFF'
    },
    bigline1: {
        paddingLeft:pxToDp(32),
        paddingRight: pxToDp(32),
        backgroundColor: '#FFFFFF',
        marginTop: pxToDp(35),
    },

    smallline1: {
        height:pxToDp(80),
        justifyContent:"space-between",
        flexDirection:"row",
        backgroundColor:'#FFFFFF'
    },
    bigsmallline: {
        flexDirection:"column",
        height:pxToDp(160),
        justifyContent:"space-between",
        backgroundColor:'#FFFFFF',
        borderBottomWidth:1,
        borderBottomColor:'#EBEBEB',
    },
    smallline: {
        height:pxToDp(86),
        justifyContent:"space-between",
        flexDirection:"row",
        backgroundColor:'#FFFFFF',
        borderBottomWidth:1,
        borderBottomColor:'#EBEBEB',
    },


    instructions: {
        color: '#000000',
        fontSize:14,
        alignSelf:'center'
    },

    instructions1: {
        // justifyContent:"center",
        marginTop:15,
        fontSize:12
    },
    instructions2: {
        // justifyContent:"center",
        fontSize:12
    },
});
